<template lang="pug">
.doctor-info-wrap
	.doctor-head-info
		.doctor-bg()
		.doctor-icon
			img(:src="doctor.doctor_photo?doctor.doctor_photo:defaultHead")
		.doctor-content
			.doctor-name
				.name {{doctor.doctor_name||''}}
				.title {{doctor.doctor_title||''}}
			.department {{doctor.department_name||''}}
			.hospital {{doctor.hospital_name}}
	.doctor-schedule
		.title 排班日期
		.schedule-table
			.table-title
				.name
					p 预<br/>约
				.name
					p 上<br/>午
				.name
					p 下<br/>午
			.time-content
				.time-wrap
					.time-block(v-for="(item,index) in dateArray" :key="index")
						.time-item
							h6
								p {{item.week}}
								small {{item.day}}
				.time-wrap
					.time-block(v-for="(item,index) in dateArray" :key="index" @click="selectTime(item,'a')")
						.time-item(:class="{'disabled':item.aLastNum === '0' || item.aStopFlag === 'Y','active':item.aStopFlag==='N' && item.aLastNum>0}")
							h6 {{item.aLastNumText}}
				.time-wrap
					.time-block(v-for="(item,index) in dateArray" :key="index" @click="selectTime(item,'p')")
						.time-item(:class="{'disabled':item.pLastNum === '0' || item.pStopFlag === 'Y','active':item.pStopFlag==='N' && item.aLastNum>0}")
							h6 {{item.pLastNumText}}
	.hospital-info
		.title 医生简介
		.info {{doctor.doctor_introduction}}
</template>

<script>
import defaultHead from '@/assets/image/order/doctorHead.png'
export default {
	name: 'doctorInfo',
	data() {
		return {
			doctor: {},
			schedule: [],
			dateArray: [],
			defaultHead: defaultHead
		}
	},
	created() {},
	mounted() {
		this.doctorInfo()
		this.dateArray = this.wx.getStorageSync('dateArray').dateArray
	},
	methods: {
		doctorInfo() {
			this.wx.showLoading({
				title: '加载中',
				icon: 'none'
			})
			let i, lastNumText
			this.api.jtApi
				.doctorInfo({
					hospital_id: this.$route.query.hospitalId.toString(),
					department_id: this.$route.query.departmentId.toString(),
					doctor_id: this.$route.query.doctorId.toString()
				})
				.then(data => {
					this.wx.hideLoading()
					if (data.ret_code === '0') {
						this.doctor = data.doctor
						let schedule = this.tools.formatToArray(data.schedulings.scheduling)
						this.dateArray.forEach(item => {
							Object.assign(item, {
								aLastNum: '',
								aLastNumText: '',
								aStopFlag: '',
								pLastNum: '',
								pLastNumText: '',
								pStopFlag: ''
							})
							for (i in schedule) {
								if (item.date === schedule[i].schedule_date) {
									Object.assign(item, { scheduleNum: schedule[i].schedule_num })
									if (schedule[i].stop_treat_flag === 'N') {
										lastNumText =
											schedule[i].last_num === '0'
												? '已约满'
												: '余' + schedule[i].last_num
									} else {
										lastNumText = '已停诊'
									}
									schedule[i].out_time === 'A' &&
										Object.assign(item, {
											aLastNum: schedule[i].last_num,
											aLastNumText: lastNumText,
											aStopFlag: schedule[i].stop_treat_flag
										})

									schedule[i].out_time === 'P' &&
										Object.assign(item, {
											pLastNum: schedule[i].last_num,
											pLastNumText: lastNumText,
											pStopFlag: schedule[i].stop_treat_flag
										})
								}
							}
						})
					}
				})
				.catch(err => {
					this.wx.hideLoading()
				})
		},
		selectTime(item, flag) {
			this.wx.setStorage({
				key: 'submitUserInfo',
				data: {
					doctor: {
						photo: this.doctor.doctor_photo,
						name: this.doctor.doctor_name,
						title: this.doctor.doctor_title,
						department: this.doctor.department_name,
						hospital: this.doctor.hospital_name
					},
					time: {
						date: item.date,
						week: item.week,
						outTime: flag //判断是上午还是下午
					}
				}
			})

			let query = {
				scheduleNum: item.scheduleNum
			}

			if (flag === 'a' && item.aLastNum > 0) {
				this.$router.push({
					path: '/views/bespeak/selectTime',
					query: Object.assign({}, query, {
						restNum: item.aLastNum
					})
				})
			}

			if (flag === 'p' && item.aLastNum > 0) {
				this.$router.push({
					path: '/views/bespeak/selectTime',
					query: Object.assign({}, query, {
						restNum: item.pLastNum
					})
				})
			}
		}
	}
}
</script>

<style lang="stylus">
	.doctor-info-wrap
		.doctor-head-info
			height 204px
			display flex
			align-items center
			padding 0 mainPadding
			position relative
			.doctor-bg
				position absolute
				cover()
				background-image url("../../assets/image/bespeak/doctorHeader.png")
				background-repeat no-repeat
				background-position center
				background-size cover
			.doctor-icon
				width 120px
				height 120px
				border-radius 50%
				overflow hidden
				position relative
				img
					width 100%
					height 100%
			.doctor-content
				flex 1
				position relative
				margin-left 30px
				color white
				.doctor-name
					display flex
					align-items center
					padding-bottom 10px
					.name
						font-size 32px
						font-weight 500
						line-height 48px
						padding-right 20px
				.title,.department,.hospital
					font-size 24px
					line-height 34px
					opacity .7
		.doctor-schedule
			background white
			margin-top mainMargin
			.title
				line-height 84px
				font-size 28px
				padding 0 mainPadding
				color blackFontColor1A
			.schedule-table
				position relative
				height 270px
				.table-title
					font-size 26px
					position absolute
					left 0
					top 0
					bottom 0
					width 64px
					line-height 30px
					.name
						height 90px
						color grayFontColor88
						text-align center
						border-width 1px 1px 0 0
						border-style solid
						border-color grayBorder
						box-sizing border-box
						center()
						background-color #fafafa
						&:first-child
							color blackFontColor4C
				.time-content
					position relative
					margin 0 0 0 64px
					font-size 0
					scrollX()
					.time-wrap
						height 90px
						.time-block
							display inline-block
							width 102px
							height 100%
							vertical-align top
						.time-item
							height 100%
							center()
							border-width 1px 1px 0 0
							border-style solid
							border-color grayBorder
							box-sizing border-box
							h6
								text-align center
								font-size 26px
								line-height 36px
								color white
								p
									color blackFontColor4C
								small
									font-size 22px
									line-height 32px
									color grayFontColor88
									padding-top 4px
							&.active
								background-color themeColor
							&.disabled
								background-color grayFontColor
		.hospital-info
			background-color white
			padding 40px mainPadding
			margin-top mainMargin
			font-size 28px
			.title
				font-weight 500
				line-height 44px
				color blackFontColor1A
				margin-bottom mainMargin
			.info
				line-height 48px
				color grayFontColor88
</style>
